.wrapper{
  background-color: rgb(247, 206, 118);
    display: flex;
  justify-content: center;
}
body{
  background-color: rgb(247, 206, 118);
 justify-content: center;
}

.from-area{
    display: flex;
    flex-direction: column;
    justify-content: center;
}
#meinBereich {
    display: flex;
    background-color: rgb(247, 206, 118);
    padding: 10px;
    justify-content: center;
  }
  
  .button1{
    display: flex;
    justify-content: center;  
    margin-top: 10px;
  }
  .buttong1{
    background-color: #ff3399; /* Startfarbe */
  color: white;
  border: none;
  padding: 10px 20px;
  border-radius: 20px;
  font-size: 16px;
  cursor: pointer;
  animation: changeColor 3s ease-in-out infinite; /* Animation */
  height: 5rem;
  width:22rem
}

@keyframes changeColor {
  0% {background-color: #ff3399;} /* Startfarbe */
  25% {background-color: #ffcc33;} /* Farbe 1 */
  50% {background-color: #66cc33;} /* Farbe 2 */
  75% {background-color: #3399cc;} /* Farbe 3 */
  100% {background-color: #ff3399;} /* Endfarbe */
}

  .Zwerge{
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .DNDK{
    text-align: center;
    justify-content: center;
  }
  .Logo{
    display: flex;
    max-width: 100%;
    height: auto;
    justify-content: center;
  }
  @media (max-width: 768px) {
    img {
      width: 50%;
    }
  }

  #meinBereich2 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-color: rgb(247, 206, 118);
    padding: 10px;
    
  }
  .Text{
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-color: rgb(247, 206, 118);
    padding: 10px;
    
  }
  .button2{
    display: flex;
    justify-content: center;  
    margin-top: 10px;
    
  }
  .Klassen{
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  @media (max-width: 768px) {
    img {
      width: 50%;
    }
  }

  .buttong2{
    background-color: #ff3399; /* Startfarbe */
  color: white;
  border: none;
  padding: 10px 20px;
  border-radius: 20px;
  font-size: 16px;
  cursor: pointer;
  animation: changeColor 3s ease-in-out infinite; /* Animation */
  height: 5rem;
  width:22rem
}

@keyframes changeColor {
  0% {background-color: #ff3399;} /* Startfarbe */
  25% {background-color: #ffcc33;} /* Farbe 1 */
  50% {background-color: #66cc33;} /* Farbe 2 */
  75% {background-color: #3399cc;} /* Farbe 3 */
  100% {background-color: #ff3399;} /* Endfarbe */
}
.Ende{
  display: flex;
  justify-content: center;
  font-size: 2rem;
}
.Designer{
  display: flex;
  justify-content: center;
  font-size: 2rem;
}